<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('信息补录')" />
    <style>
        .label-tip{
            padding-bottom: 5px ;
            border-bottom: 2px solid #f5f5f5;
            margin: 15px 0;
        }
        [v-cloak]{
            display: none;
        }
    </style>
</head>
<body class="white-bg">
    <div id="main" v-cloak class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-register-complete">
            <h4 class="label-tip">必填项</h4>
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">车牌号码：</label>
                <div class="col-sm-8">
                    <input name="plateNo" v-model="plateNo"  class="form-control" type="text" required disabled>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">混凝土标号：</label>
                <div class="col-sm-8">
                    <input name="concreteType" v-model="concreteType" class="form-control" type="text" required>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">混凝土方量(m³)：</label>
                <div class="col-sm-8">
                    <input name="concreteVolume" v-model="concreteVolume"  class="form-control" type="number" required>
                </div>
            </div>
            <h4 class="label-tip">选填项</h4>
            <div class="form-group">
                <label class="col-sm-3 control-label">公司名称：</label>
                <div class="col-sm-8">
                    <input name="companyName" v-model="companyName"  class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">商混站名：</label>
                <div class="col-sm-8">
                    <input name="mixingStation" v-model="mixingStation"  class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">机组编号：</label>
                <div class="col-sm-8">
                    <input name="machineUnit" v-model="machineUnit"  class="form-control" type="text">
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label">起始坍落度mm：</label>
                <div class="col-sm-8">
                    <input name="slumpStart" v-model="slumpStart"  class="form-control" type="number">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">工地坍落度mm：</label>
                <div class="col-sm-8">
                    <input name="slumpEnd" v-model="slumpEnd"  class="form-control" type="number">
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var prefix = ctx + "concrete/register";

        function submitHandler() {
            if ($.validate.form()) {
                app.saveCompleteInfo();
            }
        }

        var app = new Vue({
            el: '#main',
            data: {
                plateNo: [[${plateNo}]],
                seqId: [[${seqId}]],
                concreteType:'',
                concreteVolume:'',
                companyName:'',
                mixingStation:'',
                machineUnit: '',
                slumpStart:'',
                slumpEnd:'',
            },
            created() {},
            methods: {
                clearForm() {
                    this.plateNo = '',
                    this.seqId =  '',
                    this.concreteType = '',
                    this.concreteVolume = '',
                    this.companyName = '',
                    this.mixingStation = '',
                    this.machineUnit =  '',
                    this.slumpStart = '',
                    this.slumpEnd = '';
                },
                saveCompleteInfo() {
                    if (!$("#form-register-complete").validate().form()) {
                        return;
                    }
                    //保存信息
                    $.operate.save(prefix + '/saveSequenceRegisterInfo', {
                        seqId: this.seqId,
                        plateNo: this.plateNo,
                        concreteType: this.concreteType,
                        concreteVolume: this.concreteVolume,
                        companyName: this.companyName,
                        mixingStation: this.mixingStation,
                        machineUnit: this.machineUnit,
                        slumpStart: this.slumpStart,
                        slumpEnd: this.slumpEnd
                    }, res=>{
                        if (res.code === 0) {
                            setTimeout(()=>{
                                $.modal.close();
                            },500);
                        }
                    });
                }
            }
        });
    </script>
</body>
</html>